require(['./config'], () => {
  require(['request','template','exzoom','header','fly','footer','jquery','bootstrap',], (request,template, exzoom,header,fly) => {
    class Detail {
      constructor() {
        this.getData().then(() =>{
          this.exzoom()
          this.addToCart()
        })
      }
      getData() { 
        const id = location.search.slice(4)
        return new Promise(resolve => {
          request.getDetail(id).then(resp => {
            if(resp.code === 200) {
              const {
                id,
                accessoryHints,
                photo,
                title,
                commodityTypeName,
                saleNum,
                couponValue,
                couponStatus,
                originPrice,
                price,
                descContentList
              } = resp.data.detail
              this.detail = {
                id,
                accessoryHints,
                photo,
                title,
                commodityTypeName,
                saleNum,
                couponValue,
                couponStatus,
                originPrice,
                price,
                descContentList
              }
              const html = template('detail_list_template',this.detail)
              $('#detail_list').html(html)
              // 异步请求完成，数据渲染好了就可以resolve了
              resolve()
            }
          })
        })
      }
      exzoom() {
        $("#exzoom").exzoom({
          autoPlay: false,
        });
      }
      addToCart () {
        $('#addToCart').on('click', () => {
          this.fly()
          // console.log(this.fly())
          // 用localStorage来存储购物车数据

          // 存之前先取
          // 判断购物车是否已经有数据
          let cart = localStorage.getItem('cart')
          if (cart) {
            // 已经有数据了把取出来的数据push进当前detail，再重新存localStorage
            cart = JSON.parse(cart)
            // 判断当前数据再购物车里是否已存在
            const isExist = cart.some(shop => shop.id === this.detail.id)
            if (isExist) {
              // 当前数据已经被加入过购物车了，只需要count加就行了
              cart  = cart.map(shop => {
                if (shop.id === this.detail.id) shop.count++
                return shop
              })
            } else {
              // 当前数据第一次被加入购物车，那就直接push，默认count为1
              cart.push({
                ...this.detail,
                count: 1,
                check: true
              })
            }
            // 无论数据是否已存在都要在后面存localStorage
            localStorage.setItem('cart', JSON.stringify(cart))
          } else {
            // 数据为空那就存一条当前detail，但是仍然需要存一个数组（length为1）
            // 默认处于选中状态（check: true）
            localStorage.setItem('cart', JSON.stringify([{
              ...this.detail,
              count: 1,
              check: true
            }]))
          }
          // 把数据存储完成之后调用计算总量的方法
          // 或者这个方法可以在fly的回调里调用
          header.calcCartCount()
        })
      }
      fly () {
        // $('#addToCart').on('click', function (e) {
        //   $('<div class="active"></div>').fly({
        //     start:{
        //       left: e.clientX,  //开始位置（必填）#fly元素会被设置成position: fixed
        //       top: e.clientY,  //开始位置（必填）
        //     },
        //     end:{
        //       left: $('#shopCart').offset().left, //结束位置（必填）
        //       top: $('#shopCart').offset().top,  //结束位置（必填）
        //       // width: 100, //结束时高度
        //       // height: 100, //结束时高度
        //     },
        //     speed: 1.1, //越大越快，默认1.2
        //     vertex_Rtop: 100, //运动轨迹最高点top值，默认20
        //     onEnd: function(){
        //       this.destroy()
        //       $('#shopNum').html(Number($('#shopNum').html()) + 1)
        //     } //结束回调
        //   })
        // })
      }
    }
    new Detail()
  })
})